<ion-header>
	<ion-navbar>
		<button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
		<ion-title>Signup</ion-title>
	</ion-navbar>
</ion-header>

<ion-content class="login-page">

	<div class="logo">
		<img src="assets/img/appicon.svg" alt="Ionic Logo">
	</div>

	<form #signupForm="ngForm" novalidate>
		<ion-list no-lines>
			<ion-item>
				<ion-label stacked color="primary">Username</ion-label>
				<ion-input [(ngModel)]="signup.username" name="username" type="text" #username="ngModel" required>
				</ion-input>
			</ion-item>
			<p ion-text [hidden]="username.valid || submitted == false" color="danger" padding-left>
				Username is required
			</p>

			<ion-item>
				<ion-label stacked color="primary">Password</ion-label>
				<ion-input [(ngModel)]="signup.password" name="password" type="password" #password="ngModel" required>
				</ion-input>
			</ion-item>
			<p ion-text [hidden]="password.valid || submitted == false" color="danger" padding-left>
				Password is required
			</p>
		</ion-list>

		<div padding>
			<button ion-button (click)="onSignup(signupForm)" type="submit" block>Create</button>
		</div>
	</form>

</ion-content>
